<template>
	<view class="flex flex-column fab" v-if='show'>
		<image class="icon" :src="imgurl + 'common/icon-top.png'" @tap="handleBack2top"></image>
		<image class="icon" :src="imgurl + 'common/icon-tel.png'" @tap="handleCall"></image>
	</view>
</template>

<script>
import { imgurl } from '@/utils/constant.js'
export default {
	name: 'CommonFab',
	data() {
		return {
			imgurl,
			show: false,
		}
	},
	mounted() {
		uni.$on('onReachBottom', () => {
			this.show = true;
		});
	},
	beforeDestroy() {
		uni.$off('onReachBottom');
	},
	methods: {
		handleBack2top() {
			uni.pageScrollTo({
				scrollTop: 0
			})
		},
		handleCall() {
			uni.makePhoneCall({
				phoneNumber: '400-967-1517'
			})
		}
	}
}
</script>

<style>
.fab {
	position: fixed;
	right: 36rpx;
	bottom: 20vh;
	background: #ddd;
	border-radius: 999rpx;
}
.icon {
	width: 64rpx;
	height: 64rpx;
}
.icon:last-child {
	margin-top: 32rpx;
}
</style>
